<template>
   <div class="header">
     <span>返回</span>
     <section>
         {{msg}}
     </section>
     <span @click="eit">
         编辑
     </span>
   </div>
</template>
<script>
export default {
  props:{
    msg: String
  },
  setup(props,{emit}) {
    // 有两个参数 props 父传子的数据集合
    // ctx 组件的上下文
    
    const eit = () => { // 点击编辑触发的事件
      emit('abc')
    }
    return {
      eit
    }
  }
}
</script>

<style lang="scss" scoped>
.header{
  display: flex;
  height: 50px;
  align-items: center;
  section{
    flex: 1;
    text-align: center;
  }
  span{
    width: 60px;
    text-align: center;
  }
}
</style>

